<template>
  <el-table
      :data="tableData"
      style="width: 100%;padding:20px;text-align:center;padding:20px;"
      :border="true"
      stripe
      :row-style="{height: '0'}"
      :cell-style="{padding: '3px'}"
      @cell-dblclick="copy"
      >
      <el-table-column
        prop="id"
        label="进程id"
        width="180">
      </el-table-column>
      <el-table-column
        prop="displayName"
        label="进程名称"
        width="500"
        :show-overflow-tooltip="true" 
        >

      </el-table-column>
      <!-- <el-table-column
        prop="address"
        label="地址">
      </el-table-column> -->
    </el-table>
</template>

<script>
export default {
  name:'about',
  
  data(){
    return {
      tableData:[],
    }
  },
  created(){
    this.getlistVm();
  },
  methods:{

    formatter(row, column) {
        console.log(row[column.property])
        
        var length = row[column.property];
        console.log(length)
        return row.address;
      },
    getlistVm() {
      var that = this;
      this.$axios.get("/bytespy/api/v1/listVm",{}).then((data) => {
            if(data.code=='0'){
                //  var todata = [];
                // data.data.forEach((item) => {
                // //  console.log(item)
                // let tmp = {};
                // tmp.name = item.displayName;
                // tmp.id = item.id;
                // todata.push(tmp);
                // });
                that.tableData = data.data;
                console.log(that.tableData);
            }
        
      }).catch(err=>{
          console.log(err)
      });
    },
    copy(row, column, cell, event){
      console.log(row)
      // console.log(column)
      // console.log(cell)
      // console.log(event)
      
      if( event.type === "dblclick"){
          console.log(row[column.property])
          var obj= row[column.property] ;
          if(navigator.clipboard){
              console.log("navigator copy");
              navigator.clipboard.writeText(obj)
              // .then(function(data){
              //       var suc = navigator.clipboard.readText();
              //       suc.then(function(val){
              //       })
              //     },
              //     function(data){
              //         console.log(data);
              //         var oInput = document.createElement('input');
              //         oInput.value = obj;
              //         document.body.appendChild(oInput);
              //         oInput.select(); // 选择对象
              //         document.execCommand("copy"); // 执行浏览器复制命令
              //         oInput.className = 'oInput';
              //         oInput.style.display = 'none';
                
              //  });
                  
              
          }


          
      }

      this.$message({message: '复制成功', type:'success'})
    }


    
  }
}
</script>

<style>
 .about {
   height: 100vh;
   background: red;
 }


</style>
